<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page isELIgnored="false" %>

<div class="mobile-menu_wrapper" id="mobileMenu">
    <div class="offcanvas-body">
        <div class="inner-body">

            <%--关闭按钮--%>
            <div class="offcanvas-top">
                <a href="javascript:" class="button-close">
                    <i class="pe-7s-close"></i>
                </a>
            </div>

            <%--图标功能--%>
            <div class="offcanvas-user-info">
                <ul class="dropdown-wrap">
                    <li class="dropdown dropdown-left">
                        <button class="btn btn-link dropdown-toggle ht-btn p-0" type="button"
                                id="settingButtonTwo" data-bs-toggle="dropdown" aria-expanded="false">
                            <i class="pe-7s-users"></i>
                        </button>
                        <ul class="dropdown-menu dropdown-menu-end" aria-labelledby="settingButtonTwo">
                            <c:choose>
                                <c:when test="${empty usered}">
                                    <li>
                                        <a class="dropdown-item" href="/bookmall/login">
                                            <i class="pe-7s-user"></i>登录
                                        </a>
                                    </li>
                                    <li>
                                        <a class="dropdown-item" href="/bookmall/register">
                                            <i class="pe-7s-add-user"></i>注册
                                        </a>
                                    </li>
                                </c:when>
                                <c:otherwise>
                                    <li>
                                        <a class="dropdown-item" href="/bookmall/center">
                                            <i class="pe-7s-info"></i>个人信息
                                        </a>
                                    </li>
                                    <li>
                                        <a class="dropdown-item" href="/bookmall/logout">
                                            <i class="pe-7s-power"></i>退出
                                        </a>
                                    </li>
                                </c:otherwise>
                            </c:choose>
                        </ul>
                    </li>
                </ul>
            </div>

            <div>
                <nav>
                    <ul class="mobile-menu">
                        <li class="menu-item-has-children">
                            <a href="/bookmall/index">
                                <span class="mm-text">首页</span>
                            </a>
                        </li>
                        <li class="menu-item-has-children">
                            <a href="#">
                                <span class="mm-text">分类
                                    <i class="pe-7s-angle-down"></i>
                                </span>
                            </a>
                            <ul class="sub-menu" style="display: none;">
                                <li>
                                    <a href="/bookmall/types/all/1">
                                        <span class="mm-text">全部分类</span>
                                    </a>
                                </li>
                                <c:forEach items="${bookTypes}" var="type">
                                    <li>
                                        <a href="/bookmall/types/${type.typeUrl}/1">
                                            <span class="mm-text">${type.typeName}</span>
                                        </a>
                                    </li>
                                </c:forEach>
                            </ul>
                        </li>
                        <li>
                            <a href="/bookmall/recommend/hot/1">
                                <span class="mm-text">热销</span>
                            </a>
                        </li>
                        <li>
                            <a href="/bookmall/recommend/new/1">
                                <span class="mm-text">新品</span>
                            </a>
                        </li>
                        <li>
                            <a href="/bookmall/about">
                                <span class="mm-text">关于</span>
                            </a>
                        </li>
                    </ul>
                </nav>
            </div>
        </div>
    </div>
</div>